<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/header.css" />
	</head>

	<body>
		
		<header class="mui-bar mui-bar-nav title">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" style="color: white;"></a>
			<a id="link_submit_nickname" class="mui-icon mui-icon-right-nav mui-pull-right" 
				style="color: white;font-size: 14px;line-height: 25px;">完成</a>
			<h1 class="mui-title title-color">设置昵称</h1>
		</header>
		
		<div class="mui-content">
			<div class="mui-input-row">
			    <input id="txt_nickname" type="text" class="mui-input-clear" 
			    	placeholder="修改昵称">
			</div>
		</div>
		
		<script src="../js/mui.js"></script>
		<script src="../js/app.js"></script>
		<script type="text/javascript">
			mui.init()
			mui.plusReady(function () {
					var user = app.getUserGlobal();
					var nickname = user.nickname;
					//设置本地显示的用户名
					var txt_nickname = document.getElementById("txt_nickname");
					txt_nickname.value = nickname;
					//设置提交事件
					var link_submit_nickname = document.getElementById("link_submit_nickname");
					link_submit_nickname.addEventListener("tap",function(){
						var newNickName = txt_nickname.value;
						//长度判断
						if(newNickName.length<3){
							mui.toast("昵称太短",{duration:"long",type:"div"});
							return false;
						}
						if(newNickName.length>20){
							mui.toast("长度不能超过20个字符",{duration:"long",type:"div"});
							return false;
						}
						plus.nativeUI.showWaiting("请稍候...");
						mui.ajax(app.serverUrl+"/user/update/1",{
							data:{
								id:user.id,
								nickname:newNickName
							},
							dataType:'json',//服务器返回json格式数据
							type:'post',//HTTP请求类型
							timeout:10000,//超时时间设置为10秒；
							success:function(data){
								//关闭等待显示提醒
								plus.nativeUI.closeWaiting();
								if(data.status == 200){
									var userdata = data.data;
									app.setUserGlobal(userdata);
									
									//触发me页面的信息刷新
									var meWebview = plus.webview.getWebviewById("me.html");
									mui.fire(meWebview,"refresh");
									// 页面跳转
									mui.back();
								}
								
								
							},
							error:function(xhr,type,errorThrown){
								console.log(JSON.stringify(data));
							}
						});
					})
					
			})
		</script>
	</body>

</html>
